import React from "react";
import { Link, Outlet } from "react-router-dom";

export default function App() {
  return (
    <div>
      <h2>hello router</h2>
      <nav>
        <ul>
          <li>
            <Link to="/sysManage">sysManage</Link>
            <ul>
              <li>
                <Link to="/sysManage/userManage">userManage</Link>
                <ul>
                  <li>
                    <Link to="/sysManage/userManage/create">create</Link>
                  </li>
                  <li>
                    <Link to="/sysManage/userManage/detail">detail</Link>
                  </li>
                </ul>
              </li>
              <li>
                <Link to="/sysManage/permissionManage">permissionManage</Link>
                <ul>
                  <li>
                    <Link to="/sysManage/permissionManage/detail">detail</Link>
                  </li>
                </ul>
              </li>
              <li>
                <Link to="/sysManage/roleManage">roleManage</Link>
              </li>
            </ul>
          </li>
          <li>
            <Link to="/biz">biz</Link>
            <ul>
              <li>
                <Link to="/biz/customerManage">customerManage</Link>
                <ul>
                  <li>
                    <Link to="/biz/customerManage/customerManage/register">register</Link>
                    <ul>
                      <li>
                        <Link to="/biz/customerManage/customerManage/register/log">log</Link>
                      </li>
                    </ul>
                  </li>
                </ul>
              </li>
              <li>
                <Link to="/biz/monitor">monitor</Link>
              </li>
            </ul>
          </li>
        </ul>
      </nav>
      <Outlet />
    </div>
  );
}